<!DOCTYPE>
<html>
    <head>
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="index.css">
</head>
    <body>
        <div id="thePane">  
        <div id="one" class="first">
            <h2 class="title1">Products</h2>
            <p class="para1">Lorem ipsum dolor sit amet,consectetur adipisicing elit.Dolors quae porro cnosequtur aliquam,
                incidunt edius magni provident, doloridus omnis ovident, doloribus omins teporibus perferendis nesciunt.
            </p>
        </div>
        <div id="inner">
            <div class="innerOne">
                <img class="innerImg" src="1.png">
                <div class="innerMore">
                    <h4 class="innerHead">Genrics</h4>
                    <p class="innerPara">A bird in the hand is worth two in the bush. A bird is known by its note.</p> 
                </div> 
                <img/>                      
            </div>
            <div class="innerOne">
                <img class="innerImg" src="2.png">
                <div class="innerMore">
                    <h4 class="innerHead">Intermedies</h4>
                <p class="innerPara">A blind man who leans against a wall imagines that</p>
                </div>            
            </div>
            <div class="innerOne">
                <img class="innerImg" src="3.png">
                <div class="innerMore">
                    <h4 class="innerHead">Amino Acids</h4>
                <p class="innerPara">Lorem ipsum dolor sit amet, consectecur adipisicing elit.</p>
                </div>
            </div>
            <div class="innerOne">
                <img class="innerImg" src="4.png">
                <div class="innerMore">
                     <h4 class="innerHead">Synthests</h4>
                <p class="innerPara">Absence sharpens love, presence strengthens it. A chain</p>
                </div>
            </div>
            <div class="innerOne">
                <img class="innerImg" src="5.png">
                <div class="innerMore">
                     <h4 class="innerHead">Nutraceuticals</h4>
                <p class="innerPara">An optimist sees an opportunity in every calamity; a pessimist sees</p>
                </div>
            </div>
            <div class="innerOne">
                <img class="innerImg" src="6.png">
                <div class="innerMore">
                     <h4 class="innerHead">Carotenoids</h4>
                <p class="innerPara">A silent tongue and true heart are the most admirable things on earth. </p>
                </div>
            </div>
            
        </div>
         <table>
            <tr class="trclass">
                <td>
                    <img src="1.png" alt="" class="innerimg">
                    <b>Genrics</b><br>
                    <span>A bird in the hand is worth two in the bush. A bird is known by its note.</span>
                </td>
                <td>
                    <img src="2.png" alt="" class="innerimg">
                    <b>Intermedies</b><br>
                    <span>A bird in the hand is worth two in the bush. A bird is known by its note.</span>
                </td>
                <td>
                    <img src="3.png" alt="" class="innerimg">
                    <b>Amino Acids</b><br>
                    <span>A bird in the hand is worth two in the bush. A bird is known by its note.</span>
                </td>
            </tr>
            <tr class="trclass">
                <td>
                    <img src="4.png" alt="" class="innerimg">
                    <b>Synthests</b><br>
                    <span>A bird in the hand is worth two in the bush. A bird is known by its note.</span>
                </td>
                <td>
                    <img src="5.png" alt="" class="innerimg">
                    <b>Nutraceuticals</b><br>
                    <span>A bird in the hand is worth two in the bush. A bird is known by its note.</span>
                </td>
                <td>
                    <img src="6.png" alt="" class="innerimg">
                    <b>Carotenoids</b><br>
                    <span>A bird in the hand is worth two in the bush. A bird is known by its note.</span>
                </td>
            </tr>
        </table> 
       
         <div id="two" class="second">
            <h2 class="title1">Our Organization</h2>
            <p class="para1">The world's first driverless tram rolls off the production line in Qingdao, 
                Shandong province, July 28, 2017</p>
        
        <div id="three">
            <div id="four">
                <p id="para3">Starbucks Corp announced on Thursday it is taking full control of its mainland outlets after
                 a buyout deal to acquire the remaining 50 percent share it did not own from its long time joint 
                 venture partners.The Seattle-based coffee shop chain said it bought the half share from 
                 Uni-President Enterprises Corp and President Chain Store Corp for about $1.3 billion in cash.</p>
                 <ul class="arrow">
                     <li class="liname"><span class="circle">></span> Lorem inpsum do or sit amet</li><br/>
                     <li class="liname"><span class="circle">></span> Consectetur adlipicing elit</li> <br>
                     <li class="liname"><span class="circle">></span> Curablitur aliquet quam id dui</li> <br>
                     <li class="liname"><span class="circle">></span> Donec solicitudin molesstie malesuade</li> 
                </ul>
            </div>  
                <img class="innerImg" src="about.jpg">
        </div>
        </div>
    </div>
    </body>
</html>
